<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!-- public quote -->
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- jqgrid-->
<link href="${basePath}/css/plugins/jqgriddemo/css/ui.jqgrid-bootstrap.min.css" rel="stylesheet" />
<!doctype html>
<html>
<head>
</head>
<body class="gray-bg">
	<div class="creditbody">
		<div class="iboxtitle">
			<span><i class="glyphicon glyphicon-map-marker"></i>&nbsp;客户表>逾期客户表</span>
			<a href="javascript:void(0)"></a>
		</div>

		<div class="ibox-content ibox-zxsearchqu ">
			<div class="row">
				<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
					<div class="row">
						<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
							<label class="sr-only">身份证号码：</label> <input type="text"
								placeholder="身份证号码" id="customerNo" name="customerNo"
								class="form-control">
						</div>
						<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
							<label class="sr-only">客户名：</label> <input type="text"
								placeholder="客户名" id="customerName" name="customerName"
								class="form-control">
						</div>
						<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
							<label class="sr-only">业务员：</label> <input type="text"
								placeholder="业务员" id="salesmanName" name="salesmanName"
								class="form-control">
						</div>
					</div>
				</div>
				<div class="col-xs-12 col-sm-12 col-md-12 col-lg-3">
					<div class="row">
						<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
							<input id="loanTimeStart" name="loanTimeStart"
								placeholder="开始时间" class="laydate-icon form-control">
						</div>
						<label class="hxleft">至</label>
						<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
							<input id="loanTimeEnd" name="loanTimeEnd" placeholder="结束时间"
								class="laydate-icon form-control">
						</div>
					</div>
				</div>

				<div class="col-xs-12 col-sm-12 col-md-12 col-lg-5" id="buttonall">
					<button class="btn dpbtn_blue_null" type="button" onclick="query(0,0);">当日</button>
					<button class="btn dpbtn_blue_null" type="button" onclick="query(-1,-1);">昨日</button>
					<button class="btn dpbtn_blue_null" type="button" onclick="query(-6,0);">近7日</button>
					<button class="btn dpbtn_blue_null butactive" type="button" onclick="query(-29,0);">近30日</button>
					<button class="zhixcx" type="button" onclick="query();">执行查询</button>&nbsp;&nbsp;&nbsp;
				</div>
			</div>
			
		</div>
		
		<div class="ibox-content">
			<div class="jqGrid_wrapper">
				<table id="table_list_1"></table>
				<div id="pager_list_1"></div>
			</div>
		</div>
	</div>
	
	
	<div id="overDue"  style="display: none;">
		<input id="busiId" type="hidden" />
		<input id="cusId"  type="hidden" />
		<ul id="overDueTable"></ul>
		<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%">
			<tr>
				<td width="100%" align="center">
					 <div class="ibox-content">
					 	  <button type="button" class="btn dpbtn_red" onclick="enter();">确定</button>
			              <button type="button" class="btn dpbtn_grey" onclick="cancel();">取消</button>
			          </div>
				</td>
			</tr>
		</table>
	</div>			
	<!-- public quote -->
	<%@include file="/jsp/comm_js_include.jsp"%>
	<!-- jqGrid -->
	<script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/jquery.jqGrid.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/grid.locale-cn.min.js"></script>
	<!-- layerDate plugin javascript -->
	<script src="${basePath}/js/plugins/layer/laydate/laydate.js"></script>
	
	<script type="text/javascript">
		jQuery(function($) {
		
			//外部js调用
			startOption = {
			  elem: '#loanTimeStart', 
			  event: 'focus' ,
			  format: 'YYYY-MM-DD',
			  istime: false,
			  istoday: false,
			  choose: function(datas){
				 $('#buttonall .btn').removeClass('butactive');
			     endOption.min = datas;
			     endOption.start = datas;
			  },
			  clear:function(){
				  $('#buttonall .btn').removeClass('butactive');
				  endOption.min = '1970-01-01';
				  endOption.start = '1970-01-01';
			  }
			};
			    	
		   	 endOption = {
			  elem: '#loanTimeEnd', 
		      event: 'focus' ,
			  format: 'YYYY-MM-DD',
			  max: laydate.now(),
			  istime: false,
			  istoday: false,
			  choose: function(datas){
				$('#buttonall .btn').removeClass('butactive');
				startOption.max = datas;
			  },
			  clear:function(){
				  $('#buttonall .btn').removeClass('butactive');
				  startOption.max = '2099-12-31';
			  }
			};
		   	laydate(startOption);
		   	laydate(endOption);
    		
		   	$('#loanTimeStart').val(laydate.now(-29));
			endOption.min = laydate.now(-29);
			endOption.start = laydate.now(-29);
			$('#loanTimeEnd').val(laydate.now(0));
			startOption.max = laydate.now(0);
			
    		getData();
		});
		
		var yuqiDetail;
		var winWidth = $('div.ibox-content').width();
		var winHeight = document.body.offsetHeight - 310;
	    var getData = function() 
	    {
	    	var loanTimeStart = $('#loanTimeStart').val();
	    	var loanTimeEnd = $('#loanTimeEnd').val();
	    	
		    var win = winWidth / 11;
			$.jgrid.defaults.styleUI = 'Bootstrap';
			jQuery("#table_list_1").jqGrid({
			url:'${basePath}/BaseCustomerController/ovdueMultiList',
			postData:{
				"loanTimeStart":loanTimeStart,
				"loanTimeEnd":loanTimeEnd,
			},
	        datatype : "json",
	        colNames : [ '主键','', '订单提交时间','最近业务状态','业务状态','客户姓名', '身份证号码','贷款额','订单类型','订单类型','上牌地', '经销商', '经销商等级', '业务单位','业务员', '银行'],
	        colModel : [
					{name: 'replaceId', index: 'B.id', hidden:true},
					{name: 'customerId', hidden:true},
					{name: 'submitTime',index: 'E.submitTime',width: 150,align: "center",formatter:function(a,b,c){
	               	 return formateToMinutes(a);
	                }},
					{name: 'busiStatusDisplay',index: 'E.busiStatus',width: 150,align: "center",formatter:function(a,b,c){
	               	 	return '<span class="ywstatus">' + a + '</span>';
	                }},
					{name: 'busiStatus',index: 'E.busiStatus', hidden:true},
					{name: 'customerName',index: 'E.customerName',width: 130,align: "center"},
					{name: 'customerNo',index: 'E.customerNo',width: 180,align: "center"},
					{name: 'realLoanAmount',index: 'E.realLoanAmount',width: 130,align: "center"},
					{name: 'channelTypeDisplay',index: 'E.channelType',width: 130,align: "center",formatter:function(a,b,c){
						return '<span class="channelType">' + a + '</span>';
		             }},
		            {name: 'channelType',index: 'E.channelType', hidden:true},
		            {name: 'regionRegistration',index: 'regionRegistration',width: 200,align: "center", sortable:false},
					{name: 'dealerName',index: 'E.dealerName',width: 300,align: "center"},
					{name: 'dealerLevelDisplay',index: 'E.dealerLevel',width: 120,align: "center"},
					{name: 'orgName',index: 'E.orgName',width: 150,align: "center"},
					{name: 'salesmanName',index: 'E.salesmanName',width: 130,align: "center"},
					{name: 'bankLoanDisplay',index: 'E.bankLoan',width: 300,align: "center"}
					],
	          mtype : "post",
	          height: winHeight,
	          width:winWidth,  
	          shrinkToFit:false,
	          autoScroll: false,
	          rowNum: 15,
	          rowList: [15, 30, 45],
	          viewrecords: true,
	          pager: "#pager_list_1",
	          hidegrid: false,
	          multiselect : false,
	          altRows:true,
	          altclass:'someClass',
	          ondblClickRow:function(rowId,v,e)
	          {
    			  var rowData = $("#table_list_1").jqGrid("getRowData", rowId);
    			  var busiId = rowData.replaceId;
    	      	  var cusId = rowData.customerId;
    	      	  $("#busiId").val(busiId);
    	      	  $("#cusId").val(cusId);
    			  $.dpAjax({
  		    		url:'${basePath}/DhOverdueListHistoryController/list',
  		    		data:{"busiId":busiId},
  					success: function(datas){
  						var result = datas.result.rows;
  						var html = '';
  						var replaceId,dateOverdue,balanceCard,overdueStatus;
  						for(var i in result){
  							dateOverdue = formateDate(result[i].dateOverdue);
  							balanceCard = result[i].balanceCard;
  							overdueStatus = result[i].overdueStatusDisplay;
  						    html += '<li>';
  						    html += '<span class="licheckboxFloat">逾期日期：'+dateOverdue+'&nbsp;&nbsp;&nbsp;卡余额：'+balanceCard+'元&nbsp;&nbsp;&nbsp;逾期状态：'+overdueStatus+'</span></li>'
  						}
  						$("#overDueTable").html(html);
  		            }
  		    	});
    			  
	        	yuqiDetail = layer.open({
	        		type: 1,
	  	    	    title: '逾期详情',
	  	    	    shadeClose: true,
	  	    	    skin: 'layui-layer-lan',
	  	    	    area: ['480px', '350px'],
	  	    	    content: $("#overDue")
	        	}) 
	        	
	        	
	          },
	          jsonReader : {
	        	  root:"result.rows",
	        	  page: "result.page",
	        	  total: "result.total",
	        	  records: "result.records",
	        	  repeatitems: false,
	        	  id: "replaceId"
	          },
	          loadComplete:function(datas)
	          {
	        	  if (datas.flag == "100100") 
	        	  {
	                  layer.msg("查询成功!", {icon: 6, time: 1000});
	                  return;
	              }
	        	  if(datas.flag == '100802')
	        	  {
					  top.location.href = thisLoginUrl;
					  return;
				  }
	              layer.msg(datas.message, {icon: 2});
	          },
	          gridComplete:function() {
	        	  var ids = $("#table_list_1").getDataIDs();
	        	  if(!ids || ids.length == 0) {
	        		  return;
	        	  }
	        	  for(var i = 0; i < ids.length; i++) {
	        		  var row = $("#table_list_1").getRowData(ids[i]);
	        		  var channelType = row.channelType;
	        		  if(channelType == 30){
	        			  $('tr[id="' + ids[i] + '"] td span.channelType').addClass("dp-grid-red");
	        		  } else if(channelType == 50) {
	        			  $('tr[id="' + ids[i] + '"] td span.channelType').addClass("dp-grid-green");
	        		  }
	        	  }
	          }
	       });
	    }
	
	    window.onresize = function() 
	    {
	    	$("#table_list_1").setGridWidth($(window).width()-80);
	    }
	
	    var query = function(start, end)
	    {
	    	var postData = $("#table_list_1").jqGrid("getGridParam", "postData");
	    	var data = {};
	    	data.customerNo = document.getElementById('customerNo').value || '';
	    	data.customerName = document.getElementById('customerName').value || '';
	    	data.salesmanName = document.getElementById('salesmanName').value || '';
	    	if(start != null && typeof start != 'undefined') 
	    	{
	    		document.getElementById('loanTimeStart').value = laydate.now(start);
	    		document.getElementById('loanTimeEnd').value = laydate.now(end);
	    		
	    		startOption.max = laydate.now(end);
	    		endOption.min = laydate.now(start);
				endOption.start = laydate.now(start);
	    	}
	    	data.loanTimeStart = document.getElementById('loanTimeStart').value.trim();
	    	data.loanTimeEnd = document.getElementById('loanTimeEnd').value.trim();
	    	
	    	$.extend(postData, data);
	    	refresh();
	    }
	    
	    var refresh = function() {
	    	$("#table_list_1").jqGrid("setGridParam", { search: true }).trigger("reloadGrid", [{ page: 1}]);
	    }
	    
		var cancel = function() {
	    	layer.close(yuqiDetail);
	    }
	    
	    var enter = function() {
	    	var busiId = $("#busiId").val();
	    	var cusId = $("#cusId").val();
      	    window.location.href="${basePath}/web/system/kehubiao/dhCollectionDetail.jsp?busiId="+busiId+"&cusId="+cusId;
	    }
	    
</script>
</body>
</html>
